<template>
	<mg-form vueId="21d3bdfb-1" :vueSlots="['default']">
		<view class="f-col h100 ">
			<mg-cell :bbt="'名称:'+(shopinfo.name||'')" bgc="transparent" btt="付款给商家" bttc="f32 wei" last="1"
				:vueId="'21d3bdfb-2'+','+'21d3bdfb-1'" :vueSlots="['ft']">
				<view class="sjimg bsf " slot="ft">
					<mg-img :src="shopinfo.icon||''" :vueId="'21d3bdfb-3'+','+'21d3bdfb-2'"></mg-img>
				</view>
			</mg-cell>
			<view class="f-g-1 bf mdbd p30 ">
				<view class="mdbdt ">
					<view class="c9 f-x-bt ">
						<text>金额</text>
						<text>请询问服务员后输入</text>
					</view>
					<view class="p20 b-b-e f-row " style="align-items:flex-start;">
						<text class="mr20 f56 wei " style="margin-top:-6rpx;">{{sl}}</text>
						<input class="f-g-1 mdinput wei " focus="true" maxlength="6" placeholder="输入金额" placeholderClass="mdps itpc"
							placeholderStyle="line-height: normal;" :style="'caret-color:'+tColor+';'" type="digit" v-model="money" />
					</view>
				</view>
				<view class="mdbdb mt30 " v-if="mdconfig">
					<mg-cell arrow="1" @tab="go({t:1,url:'/yb_o2o/my/coupon/use-coupon?storeId='+params.storeId})" btt="优惠券抵扣"
						bttc="f30 wei" cname="p30" :color="kyhb.n>0?tColor:''" isl="1" last="1" :vueId="'21d3bdfb-4'+','+'21d3bdfb-1'"
						:vueSlots="['ft']" v-if="yhq">
						<view slot="ft">
							<text class="f32 " v-if="couponInfo">{{'-'+sl+couponInfo.money}}</text>
							<block v-else>
								<view class="hongbao bs5 f20 f-y-c " v-if="kyhb.n>0">
									<text class="iconfont iconhb cf mr10 f26 "></text>{{kyhb.n+'个可用'}}</view>
								<block v-else>
									<view class="f24 f-y-c " v-if="kyhb.n==0">暂无可用</view>
								</block>
							</block>
						</view>
					</mg-cell>
					<mg-cell cname="p30" :ft="'-'+sl+zkmoney" ftc="f32" isl="1" last="1" :vueId="'21d3bdfb-5'+','+'21d3bdfb-1'"
						:vueSlots="['bd']" v-if="vip">
						<view slot="bd">
							<text class="f30 wei ">会员折扣</text>
							<text class="ml10 cfc " v-if="user.discount">{{'（'+user.discount+'折）'}}</text>
						</view>
					</mg-cell>
				</view>
				<view class="mdbdb mt30 ">
					<mg-cell btt="实际应付" bttc="f30 wei" cname="p30" isl="1" last="1" :vueId="'21d3bdfb-6'+','+'21d3bdfb-1'"
						:vueSlots="['ft']">
						<view class="c3 " slot="ft">
							<text class="mr20 ">合计</text>
							<text class="f26 ">{{sl}}</text>
							<text class="f40 ">{{money?total:0}}</text>
						</view>
					</mg-cell>
					<view class="p20 f-y-c ">
						<view class="mr30 ">备注</view>
						<input class="weui-input f-1 " maxlength="20" placeholder="添加备注(20字以内)" placeholderClass="itpc"
							v-model="params.userNote" />
					</view>
				</view>
				<view class="foot-btnc " v-if="shopinfo.id">
					<button @tap="qdzf" class="foot-btn " :disabled="loading" :loading="loading"
						:style="'background:'+tColor+';'">已和店员确认，立即买单</button>
				</view>
			</view>
		</view>
	</mg-form>
</template>


<script>
	import MgCell from 'components/common/mg-cell.vue';
	import sqBtn from 'components/common/sq-btn.vue';
	import {
		mapActions,
		mapState,
	} from 'vuex'
	import {
		deepCopy,
		getOptions,
		message,
		setNT
	} from 'common/util';
	import {
		utilMixins
	} from 'common/utilMixins';
	export default {
		name: "bzf",
		components: {
			MgCell,
			sqBtn,
		},
		data: function() {
			return {
				money: "",
				params: {
					money: "",
					storeId: "",
					userNote: "",
					useCouponId: ""
				},
				shopinfo: {},
				mdconfig: null,
				loading: !1,
				kyhb: {
					n: 0,
					data: []
				},
				couponInfo: null
			}
		},
		onLoad: function(t) {
			var n = this;
			n.getSystem(), setNT("买单"), n.params.storeId = getOptions(t, {
					key: "storeId",
					q1: n.storeInfo.id
				}), n.getLoginInfo().then((function() {})),

				this.$api.order_order__set({
					storeId: n.params.storeId
				}).then(res => {
					n.shopinfo = res;
				})
		},
		mixins: [utilMixins],
		computed: {
			...mapState({
				storeInfo: function(t) {
					return t.config.storeInfo
				}
			}),
			yhq: function() {
				return this.mdconfig && this.mdconfig.discount.indexOf("1") > -1
			},
			vip: function() {
				return this.isVip && this.mdconfig && this.mdconfig.discount.indexOf("3") > -1
			},
			zkmoney: function() {
				var t = 0,
					n = +(this.couponInfo && this.couponInfo.money || 0);
				return this.vip && this.user.discount && (t = (10 - this.user.discount) / 10 * (this.money - n)), this
					.blxs(t)
			},
			total: function() {
				var t = 0,
					n = +(this.couponInfo && this.couponInfo.money || 0),
					e = this.zkmoney;
				return t = this.blxs(this.money - n - e), t <= 0 && (t = .01), t
			}
		},
		methods: {
			minput: function(t) {
				this.couponInfo = null
			},
			changeUsecoupon: function() {
				var n = 0,
					e = deepCopy(this.yhqArr);
				for (var r in e) 1 == e[r].isUse && (this.money >= +e[r].full || 1 == e[r].isLimit ? (e[r].isUse = 1, n +=
					1) : e[r].isUse = 2);
				this.kyhb = {
					n: n,
					data: e
				}, t.setStorageSync("kyhb", this.kyhb)
			},
			getConfig: function() {
				var t = this;
				this.$api.config_config({
					ident: "cashierset"
				}).then(res => {
					t.mdconfig = res;
				})
			},
			getyhqArr: function() {
				var n = this;
				// return l(r.default.mark((function e() {
				// 	var o, u;
				// 	return r.default.wrap((function(e) {
				// 		while (1) switch (e.prev = e.next) {
				// 			case 0:
				// 				return n.util.showLoading(), t.setStorageSync("kyhb", {
				// 					n: 0,
				// 					data: []
				// 				}), e.next = 4, n.util.request({
				// 					url: n.api.AvailableCoupon,
				// 					method: "POST",
				// 					data: {
				// 						type: 3,
				// 						userId: n.params.userId,
				// 						storeId: n.params.storeId
				// 					}
				// 				});
				// 			case 4:
				// 				o = e.sent, u = o.data, u && (n.yhqArr = u, n.changeUsecoupon()), t.hideLoading();
				// 			case 8:
				// 			case "end":
				// 				return e.stop()
				// 		}
				// 	}), e)
				// })))()
			},
			changeCoupon: function(t) {
				this.couponInfo = t || null, this.params.useCouponId = t ? t.id : "", console.log(t)
			},
			qdzf: function() {
				var t = this;
				if (!t.money) return message("请输入金额", 3);
				t.checkLogin().then(res => {
					t.requestSM("cashierOrder");
					this.$api.cashier_save__cashier(t.params).then(res => {
						t.go({
							t: 2,
							url: "/yb_wm/other/mg-pay?payObj=" + encodeURIComponent(JSON.stringify({
								orderId: res,
								orderType: 5,
								info: {
									money: t.total,
									type: "买单支付",
									cancel: 1,
									go: {
										t: 6,
										url: "/yb_wm/index/order-index"
									}
								}
							}))
						})
					})
				})
			}
		}
	}
</script>
<style scoped>
	page {
		background-color: #f8f8f8;
	}

	.itpc {
		color: #e6e6e6;
	}

	.mdps {
		font-size: 45rpx;
		font-weight: 400;
		line-height: normal;
	}

	.cfc {
		color: #ff5d0c;
	}

	.sjimg {
		width: 90rpx;
		height: 90rpx;
	}

	.mdbd {
		border-radius: 40rpx 40rpx 0 0;
	}

	.mdbdt {
		margin: 0 50rpx;
	}

	.mdinput {
		font-size: 70rpx;
		height: 2.9rem;
		line-height: 2.9rem;
		caret-color: #17e883;
	}

	.mdbdb {
		padding: 0 50rpx;
	}

	.hdwith {
		width: 100rpx;
	}
</style>